<template>
  <div>
    <basic-container>
      <avue-crud
        ref="scopeTree"
        :data="tableData"
        :option="option"
        :page="page"
        :destroy-on-close="true"
        @refresh-change="searchHandler"
        @on-load="onLoad"
        @search-change="searchChange"
        :cell-style="cellStyle"
      >
        <template slot-scope="scope" slot="menu">
          <el-button
            @click="drawerOpen(scope.row)"
            icon="el-icon-arrow-right"
            size="small"
            type="text"
            >查看审批过程</el-button
          >
        </template>
      </avue-crud>
    </basic-container>
    <el-drawer
      title="审批过程"
      :visible.sync="drawer"
      :direction="rtl"
      :before-close="handleClose"
      append-to-body="true"
      :destroy-on-close="true"
    >
      <moralEducationDrawer
        v-if="type === 10"
        :reviewId="reviewId"
        :isApprovue="false"
      ></moralEducationDrawer>
      <jobDrawer
        v-if="type === 20"
        :reviewId="reviewId"
        :isApprovue="false"
      ></jobDrawer>
      <goodThingsDrawer
        v-if="type === 30"
        :reviewId="reviewId"
        :isApprovue="false"
      ></goodThingsDrawer>
      <publicWelfareDrawer
        v-if="type === 40"
        :reviewId="reviewId"
        :isApprovue="false"
      ></publicWelfareDrawer>
      <certificateDrawer
        v-if="type === 50"
        :reviewId="reviewId"
        :isApprovue="false"
        @close="close"
      ></certificateDrawer>
      <innovativeDrawer
        v-if="type === 60"
        :reviewId="reviewId"
        :isApprovue="false"
        @close="close"
      ></innovativeDrawer>
      <courseDrawer
        v-if="type === 70"
        :reviewId="reviewId"
        :isApprovue="false"
        @close="close"
      ></courseDrawer>
      <culturalDrawer
        v-if="type === 80"
        :reviewId="reviewId"
        :isApprovue="false"
        @close="close"
      ></culturalDrawer>
      <culturalTransmissDrawer
        v-if="type === 90"
        :reviewId="reviewId"
        :isApprovue="false"
        @close="close"
      ></culturalTransmissDrawer>
    </el-drawer>
  </div>
</template>
<script>
import { getHasApprove } from "@/api/teacherPage/review";
import { baseUrl } from "@/config/env";
import moralEducationDrawer from "../../components/reviewDrawer/moralEducationDrawer.vue";
import goodThingsDrawer from "../../components/reviewDrawer/goodThingsDrawer.vue";
import jobDrawer from "../../components/reviewDrawer/jobDrawer.vue";
import publicWelfareDrawer from "../../components/reviewDrawer/publicWelfareDrawer.vue";
import certificateDrawer from "../../components/reviewDrawer/certificateDrawer";
import innovativeDrawer from "@/components/reviewDrawer/innovativeDrawer";
import courseDrawer from "@/components/reviewDrawer/courseDrawer";
import culturalDrawer from "../../components/reviewDrawer/culturalDrawer";
import culturalTransmissDrawer from "@/components/reviewDrawer/culturalTransmissDrawer";

export default {
  components: {
    moralEducationDrawer,
    goodThingsDrawer,
    jobDrawer,
    publicWelfareDrawer,
    certificateDrawer,
    innovativeDrawer,
    courseDrawer,
    culturalDrawer,
    culturalTransmissDrawer,
  },
  name: "review",
  data() {
    return {
      page: {
        pageSize: 10,
        total: 10,
      },
      drawer: false,
      reviewId: "1",
      type: "",
      headers: {
        Authorization: "",
      },
      actionurl: baseUrl + "/pc/absent-class/upload",
      searchForm: {
        currentPage: 1,
        pageSizes: 10,
      },
      tableData: [],
      option: {
        border: true,
        index: true,
        indexLabel: "序号",
        stripe: true,
        menuAlign: "center",
        editBtn: false,
        delBtn: false,
        addBtn: false,
        viewBtn: false,
        searchMenuSpan: 6,
        align: "center",
        column: [
          {
            label: "标题",
            prop: "title",
            search: true,
            searchLabelWidth: 50,
          },
          {
            label: "学号",
            prop: "applyUsername",
          },
          {
            label: "申请时间",
            prop: "createTime",
            type: "datetime",
            format: "yyyy-MM-dd HH:mm",
          },
          {
            label: "类型",
            prop: "type",
            type: "select",
            search: true,
            dicData: [
              {
                label: "德育素质",
                value: 10,
              },
              {
                label: "学生干部任职",
                value: 20,
              },
              {
                label: "好人好事",
                value: 30,
              },
              {
                label: "公益活动",
                value: 40,
              },
              {
                label: "证书申请",
                value: 50,
              },
              {
                label: "创新创业认定",
                value: 60,
              },
              {
                label: "学科竞赛",
                value: 70,
              },
              {
                label: "文艺活动",
                value: 80,
              },
              {
                label: "文艺传播",
                value: 90,
              },
            ],
          },
          {
            label: "状态",
            prop: "status",
            type: "select",
            dicData: [
              {
                label: "待审批",
                value: 10,
              },
              {
                label: "已审批",
                value: !10,
                children: [
                  {
                    label: "通过",
                    value: 20,
                  },
                  {
                    label: "拒绝",
                    value: -10,
                  },
                  {
                    label: "退回修改",
                    value: -20,
                  },
                ],
              },
            ],
          },
        ],
      },
    };
  },
  created() {
    this.searchHandler();
  },

  methods: {
    cellStyle({ row, columnIndex }) {
      if (columnIndex == 5) {
        if (row.status == 20) {
          return {
            color: "green",
            fontWeight: "bold",
            fontSize: "20",
          };
        } else if (row.status == 10) {
          return {
            color: "#f19a0b",
            fontWeight: "bold",
            fontSize: "20",
          };
        } else if (row.status == "-10") {
          return {
            color: "#e5021e",
            fontWeight: "bold",
            fontSize: "20",
          };
        } else if (row.status == "-20") {
          return {
            color: "#b0a305",
            fontWeight: "bold",
            fontSize: "20",
          };
        }
      }
    },
    searchChange(params, done) {
      console.log(params);
      this.searchForm.type = params.type;
      this.searchForm.title = params.title;
      this.searchHandler();
      done();
    },
    searchHandler() {
      getHasApprove(this.searchForm).then((res) => {
        this.page.pageSizes = res.data.pageSizes;
        this.page.total = res.data.total;
        this.tableData = res.data.records;
      });
    },
    onLoad(page) {
      this.searchForm.currentPage = page.currentPage;
      this.searchForm.pageSize = page.pageSize;
      this.searchHandler();
    },
    drawerOpen(res) {
      this.reviewId = res.id;
      this.drawer = true;
      this.type = res.type;
    },
  },
};
</script>

<style></style>
